<template>
	<div class="app-container">
		<el-row :gutter="10" class="mb8">
			<el-col :span="14">
				<el-form ref="form" :inline="true" label-width="80px">
					<el-badge :value="total" class="item" :hidden="total===0">
						<el-button type="primary" @click="waitList" size="small">候诊列表</el-button>
					</el-badge>
					<!--<el-button style="margin-left: 9px;" type="primary" @click="submitPatient" size="small">提交患者</el-button>-->
					<el-button style="margin-left: 9px;" type="primary" size="small" @click="addTemplate">导入模板
					</el-button>
					<el-button type="primary" size="small">咨询记录</el-button>
					<el-popconfirm confirmButtonText='完诊' :cancelButtonText='cancelButton' icon="el-icon-info"
								   iconColor="#E6A23C" title="您确认要完诊吗？" style="margin-left: 10px;"
								   @onConfirm="onConfirm" @onCancel="onCancel">
						<el-button slot="reference" type="primary" size="small"
								   :disabled="this.currentRow.orderId===-1" @click="cancelButtonClick">完诊
						</el-button>
					</el-popconfirm>
					<el-button style="margin-left: 10px;" type="primary" size="small">打印</el-button>
					<el-button type="primary" size="small">添加模板</el-button>
					<el-switch @change="handleChange" style="margin-left: 9px;" v-model="doctor.isOpen === 0"
							   active-color="#13ce66" active-text="是否开诊"></el-switch>
				</el-form>
			</el-col>
			<el-col :span="10">
				<el-popover placement="bottom" width="400" trigger="hover">
					<div class="grid-content bg-purple" v-if="currentRow.patient">
						<p>就诊卡号 :<span class="colorC">{{ currentRow.patient.card }}</span></p>
						<p>社保卡号 :<span class="colorC">{{ currentRow.patient.card }}</span></p>
						<p>身份证 :<span class="colorC">{{ currentRow.patient.idCard }}</span></p>
						<p>手机号码 :<span class="colorC">{{ currentRow.patient.phone }}</span></p>
						<p>病情描述 :</p><span style="font-size: 10px;color: gray">{{ currentRow.illnessDesc.desc }}</span>
						<p>过敏史 :</p><span style="font-size: 10px;color: gray">{{ inquiry.allergyHistory }}</span>
						<p>家族史 :</p><span style="font-size: 10px;color: gray">{{ inquiry.familyHistory }}</span>
					</div>
					<div slot="reference" class="patientInfos">
						<div><img :src="patientImg?patientImg:defaultPatientImg"></div>
						<div><p>患者姓名 :<span>{{ currentRow.patient ? currentRow.patient.patientName : '' }}</span></p>
						</div>
						<div><p>性别 :<span>{{
								currentRow.patient ? currentRow.patient.sex === 1 ? '女' : '男' : ''
							}}</span></p></div>
						<div><p>出生日期 :<span>{{ currentRow.patient ? currentRow.patient.birthDate : '' }}</span></p>
						</div>
					</div>
				</el-popover>
			</el-col>
		</el-row>
		<el-row style="position:relative">
			<div class="videoRoom" :class="{ 'videoBig': isBig, 'videoSmall': isSmall }" v-if="currentRow.patient">
				<img v-if="isSmall" src="../../../static/big.png" @click="changeStyle(true)">
				<img v-if="isBig" src="../../../static/small.png" @click="changeStyle(false)">
				<ChatRoom ref="chatRoom" :orderId="currentRow.orderId.toString()" :tableLength="inquiryTableData.length"
						  :receiver="currentRow.patient.userId.toString()" :currentRow="currentRow" @onCancel="onCancel" @onConfirm="onConfirm"></ChatRoom>
			</div>
			<el-col :span="24">
				<div class="grid-content bg-purple-light">
					<el-row>
						<el-col :span="24">
							<div class="grid-content bg-red">
								<el-tabs type="border-card">
									<el-tab-pane label="西药处方">
										<el-button type="primary" size="small" @click="addDrugTable()"
												   :disabled="tableData.length >=5||currentRow.orderId===-1">加药
										</el-button>
										<el-button type="primary" size="small" :disabled="tableData.length === 0"
												   @click="delDrugTable">删药
										</el-button>
										<el-button type="primary" size="small">医生常用药</el-button>

										<el-button type="primary" size="small" :disabled="currentRow.orderId===-1"
												   @click="addPrescriptionInfoTable">提交
										</el-button>
										<el-table class="addDrug" :data="tableData"
												  style="width: 100%;margin-top:10px;height:300px" border
												  highlight-current-row @current-change="handleCurrentChange"
												  @row-click="rowClick" :row-class-name="tableRowClassName"
												  max-height="400" ref="multipleTable">
											<el-table-column label="药品名" width="200">
												<template slot-scope="scope">
													<el-autocomplete
														v-model="scope.row.drugName"
														:fetch-suggestions="querySearchAsync"
														placeholder="请输入内容"
														@select="handleSelect"
														@focus="handleFocus(scope.$index)"
														size="mini"
														:ref="'drugInput' + scope.$index"
													></el-autocomplete>
												</template>
											</el-table-column>
											<el-table-column prop="drug.spec" label="规格" width="70"></el-table-column>
											<el-table-column label="单次用量" width="100">
												<template slot-scope="scope">
													<el-input-number width="80" v-model="scope.row.singleDosage"
																	 controls-position="right" :min="1" :max="100"
																	 size="mini"></el-input-number>
												</template>
											</el-table-column>
											<el-table-column  label="计量单位"width="100">
												<template slot-scope="scpoe">
													<el-select v-model=" scpoe.row.drug.dosageUnit " size="small">
														<el-option v-for="(item, index) in dosUnit" :key="index"
															:label="item.dictLabel" :value="Number(item.dictValue)"></el-option>
													</el-select>
												</template>
											</el-table-column>
											<el-table-column label="频次" width="120">
												<template slot-scope="scpoe">
													<el-select v-model=" scpoe.row.frequency " size="small">
														<el-option v-for="(item, index) in frequencyOption" :key="index"
															:label="item.dictLabel" :value="Number(item.dictValue)"></el-option>
													</el-select>
												</template>
											</el-table-column>
											<el-table-column prop="days" label="天数" width="100">
												<template slot-scope="scpoe">
													<el-select v-model=" scpoe.row.days" size="mini">
														<el-option v-for="(item, index) in daysOption" :key="index"
															:label="item.dictLabel" :value="Number(item.dictValue)"></el-option>
													</el-select>
												</template>
											</el-table-column>
											<el-table-column label="用法" width="100">
												<template slot-scope="scpoe">
													<el-select v-model="scpoe.row.usage" size="mini">
														<el-option v-for="(item, index) in usageOption" :key="index"
															:label="item.dictLabel" :value="Number(item.dictValue)"></el-option>
													</el-select>
												</template>
											</el-table-column>
											<el-table-column prop="total" label="总量" width="100">
												<template slot-scope="scpoe">
													<el-input-number v-model="scpoe.row.total" controls-position="right"
														:min="1" :max="100" size="mini"></el-input-number>
												</template>
											</el-table-column>
											<el-table-column label="单位" width="60">
												<template slot-scope="scpoe">
													{{ retailFilter(scpoe.row.drug.retailUnit) }}
												</template>
											</el-table-column>
											<el-table-column prop="entrust" label="嘱托" width="140">
												<template slot-scope="scpoe">
													<el-select v-model=" scpoe.row.entrust " size="mini">
														<el-option v-for="(item, index) in entrustOption" :key="index"
															:label="item.dictLabel" :value="Number(item.dictValue)"></el-option>
													</el-select>
												</template>
											</el-table-column>
											<div slot="empty">
												<svg-icon icon-class="no-data" class-name='no-data-class'/>
												<br><span style="font-size: 30px;">暂无数据</span></div>
										</el-table>
										<p>诊断结果 :
											<el-input type="textarea" v-model="result" size="small"></el-input>
										</p>
										<p>医生嘱托 :
											<el-input type="textarea" v-model="entrust" size="small"></el-input>
										</p>
										<p style="border-bottom: 1px solid #000;"></p>
										<div class="infos" v-if="drugInfoFlag">
											<p>药品编码 :<span>{{ drugArr.number }}</span></p>
											<p>通用名 :<span>{{ drugArr.name }}</span></p>
											<p>剂型 :<span>{{ setDosageLabel(drugArr.dosageType) }}</span></p>
											<p>厂家/产地 :<span>{{ drugArr.manufacturer }}</span></p>
											<p>零售价格 :<span>{{ drugArr.retailPrice }}</span></p>
										</div>
									</el-tab-pane>
								</el-tabs>
							</div>
						</el-col>
					</el-row>
				</div>
			</el-col>
		</el-row>
		<template slot="footer"></template>
		<el-dialog title="提示" :visible.sync="dialogVisible" @close="dialogVisible=false" width="75%">
			<el-table v-loading="tableLoading" :data="inquiryTableData" style="width: 100%" size="small" stripe>
				<el-table-column type="index" :index="indexMethod" width="50" label="序号"></el-table-column>
				<el-table-column prop="code" width="100" label="订单编号"
								 :show-overflow-tooltip="true"></el-table-column>
				<el-table-column prop="illnessDesc.desc" label="病情描述"></el-table-column>
				<el-table-column prop="patient.patientName" width="100" label="患者姓名"></el-table-column>
				<el-table-column prop="patient.birthDate" width="100" label="出生年月"></el-table-column>
				<el-table-column label="患者性别" width="100">
					<template slot-scope="scope">{{ scope.row.patient.sex|sexFilter }}</template>
				</el-table-column>
				<el-table-column prop="salePrice" label="销售价" width="80"></el-table-column>
				<el-table-column prop="finalPrice" label="实付款" width="80"></el-table-column>
				<el-table-column prop="createTime" label="创建时间" width="200"></el-table-column>
				<el-table-column label="操作" width="100" fixed="right">
					<template slot-scope="scope">
						<el-button @click="receivePatient(scope.row)" type="text" size="small"
								   :disabled="indexMethod(scope.$index) !== 1">接诊
						</el-button>
					</template>
				</el-table-column>
			</el-table>
			<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="getOrderList(false)"/>
			<span slot="footer" class="dialog-footer">
	    		<el-button @click="dialogVisible = false">取 消</el-button>
	    		<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
	  		</span>
		</el-dialog>
	</div>
</template>

<script>
import {GetDrugAll, GetDrugId} from "@/api/doctor/drug";
import {EditDoctor, GetDoctorById} from '@/api/doctor/index'
import {formatDate} from "@/utils/index";
import {AddPreDrug} from '@/api/drug/drug'
import ChatRoom from "../chat/index.vue";
import {AddPrescribe, GetServedList, EditInquiryOrder} from "@/api/order/inquriy";
import {mapGetters, mapActions, mapMutations} from "vuex";
import {AddMessage} from "@/api/message";
import {GetPreList} from "@/api/prescribe";
import {SubscribeMessage} from "@/api/server"
import store from "@/store";

export default {
	components: {
		ChatRoom
	},
	inject: ['reload'], //刷新页面不闪烁
	data() {
		return {
			orderId: this.$route.query.orderId,
			receiver: this.$route.query.receiver,
			activeName: 'waiting',
			content: null,
			roomTableData: [],
			inquiryTableData: [],
			total: 0,
			id: '',
			prescriptionInfo: null,
			nameArr: [],
			inquiry: {
				id: ''
			},
			tableLoading: false,
			rules: {
				drugName: [{required: true, message: '请选择药品名称', trigger: 'blur'}],
				spec: [{required: true, message: '请输入规格', trigger: 'blur'}],
				dosageUnit: [{required: true, message: '请输入计量单位', trigger: 'blur'}],
				singleDosage: [{required: true, message: '请输入单次用量', trigger: 'blur'}],
				days: [{required: true, message: '请输入天数', trigger: 'blur'}],
				frequency: [{required: true, message: '请输入频次', trigger: 'blur'}],
				total: [{required: true, message: '请输入总量', trigger: 'blur'}],
				entrust: [{required: true, message: '请输入嘱托', trigger: 'blur'}],
			},
			form: {
				onsetTime: null,
				complaint: '',
				illnessHistory: '',
				pastHistory: '',
				geneticHistory: '',
				diagnosis: '',
				medicalAdvice: '',
				inquiryId: '',
				createTime: '',
				updateTime: ''
			},
			prescriptionForm: {
				id: '',
				remarks: '',
				price: '',
			},
			tableData: [],
			drugName: null,
			drugArr: {},
			drugInfoFlag: false,
      		dosUnit:[],
			frequencyOption: [],
			daysOption: [],
			usageOption: [],
			entrustOption: [],
			retailOption: [],
      		dosageForm:[],
			num: null,
			patientImg: '',
			defaultPatientImg: require('../../assets/image/profile.png'),
			receiveId: null,
			isBig: true,
			isSmall: false,
			queryParams: {
				pageNum: 1,
				pageSize: 10
			},
			currentRow: {
				orderId: -1,
			},
			currentDrug: {},
			currentIndex: 0,
			entrust: undefined,
			result: undefined,
			dialogVisible: false,
			isOpen: true,
			cancelButton: '完诊并接诊下一位',
			count: 11,
			interval: undefined,
		};
	},
	created() {
		document.addEventListener('keydown', this.handleKeyDown);
		window.confirmCallback = this.confirmCallback;
		// this.initData()
	},
	mounted() {
		this.getOrderList();
		// 10秒轮询调用
		setInterval(() => {
		  	setTimeout(this.getOrderList(false), 0);
    	}, 10000);
	},
	computed: {
		...mapGetters(['doctor', 'userid', "messageList"]),
		setDosageLabel(text) {
		  return ((text) => {
			for (let i = 0; i < this.dosageForm.length; i++) {
			  if (this.dosageForm[i].dictValue === text) {
				return this.dosageForm[i].dictLabel;
			  }
			}
			return text;
		  })
		},
		retailFilter(text) {
			return ((text) => {
				for (let i = 0; i < this.retailOption.length; i++) {
					if (this.retailOption[i].dictValue == text) {
						return this.retailOption[i].dictLabel;
					}
				}
			})
		},
		attackDays: {
			get: function () {
				let startTime = this.form.onsetTime;
				let endTime = formatDate(new Date());
				let dateSpan = Date.parse(startTime) - Date.parse(endTime);
				dateSpan = Math.abs(dateSpan);
				let iDays = Math.floor(dateSpan / (24 * 3600 * 1000));
				if (!iDays) {
					iDays = null
				}
				return iDays
			},
			set: function (newValue) {
				this.num = newValue
			}
		}
	},
	destroyed() {
		document.removeEventListener('keydown', this.handleKeyDown);
	},
	filters: {
		sexFilter: function (text) {
			if (text == 1) {
				return '女';
			} else {
				return '男';
			}
		}
	},
	methods: {
		...mapActions(['sendTextMsg', 'sendImgMsg']),
    	...mapMutations(['pushMessageList']),
		confirmCallback() {
			this.count = 11;
			this.countDown();
			this.interval = setInterval("this.countDown", 1000)
			this.$confirm('对方已挂断, 是否继续呼叫?', '提示', {
				confirmButtonText: '确认(10)',
				cancelButtonText: '取消',
				confirmButtonClass: 'confirmCallback',
				type: 'info'
			}).then(() => {
				this.$refs.chatRoom.videoCall();
			});
		},
		countDown() {
			let button = document.querySelector('.confirmCallback > span');
			if (this.count == 1) {
				button.innerHTML = '确认';
				button.click();
			} else {
				this.count -= 1;
				if(button) {
					button.innerHTML = `确认(${this.count})`
				}
				setTimeout(() => {
					this.countDown();
				}, 1000);
			}
		},
		// 患者列表
		waitList() {
			this.dialogVisible = true;
		},
		// 添加模板
		addTemplate() {

		},
		indexMethod (index) {
			let pageNum = this.queryParams.pageNum ;  //单前页码，具体看组件取值
			let pageSize = this.queryParams.pageSize;    //每页条数，具体是组件取值
			return (index+1) + (pageNum-1)*pageSize
		},
		changeStyle(value) {  //修改视频窗口大小
			this.isBig = value
			this.isSmall = !value
		},
		handleKeyDown(e) {
			var key = window.event.keyCode ? window.event.keyCode : window.event.which
			if (key === 45) {
				//this.addDrugTable();
				if (this.tableData.length < 5 && this.prescriptionForm.id != '') {
					this.addDrugTable();
				}
				e.preventDefault() //取消浏览器原有的ctrl+s操作
			}

			if (key === 46) {
				if (this.tableData.length < 5 && this.prescriptionForm.id != '') {
					// this.delPrescriptionInfoById()
				}
				e.preventDefault() //取消浏览器原有的ctrl+s操作
			}
		},
		getOrderList(flag) {
			this.tableLoading = true;
			let params = Object.assign({doctorId: this.doctor.doctorId}, this.queryParams)
			GetServedList(params).then(res => {
				this.inquiryTableData = res.rows;
				this.total = res.total;
				// 完诊并接下一位
				if (flag) {
					this.$refs.chatRoom.videoCall();
					this.currentRow = this.inquiryTableData[0];
					this.pushDrug(this.currentRow);
				}
				this.tableLoading = false;
			});
		},
		// 查看病例信息
		receivePatient(row) {
			console.log(row)
			this.$confirm('确认接诊, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.currentRow = row;
				this.receiveId = row.id;
				this.dialogVisible = false;
				this.getDrug();
				this.getSysDict();
				this.pushDrug(row);
				this.changeStyle(true);
				this.subscribeMessage(row.patient.userId);
				setTimeout(() => {
					this.$refs.chatRoom.videoCall();
				}, 500)
				let params = {
					orderId: this.currentRow.orderId,
					status: 4,
				}
				EditInquiryOrder(params).then(() => {})
			})
		},
		subscribeMessage(userId) {
			SubscribeMessage({userId: userId});
		},
		pushDrug(row) {
			if (row.illnessDesc.prescribeId) {
				let preDrugs = row.illnessDesc.prescribe.preDrugs;
				for (let i = 0; i < preDrugs.length; i++) {
					let preDrug = preDrugs[i];
					let item = {
						id: preDrug.drugId,
						drugName: preDrug.drug.name,
						total: preDrug.drugUnit,
						frequency: preDrug.frequency,
						singleDosage: preDrug.singleUnit,
						entrust: preDrug.entrust,
						days: preDrug.medicationDays,
						usage: preDrug.medicationUsage,
						drug: {
							id: preDrug.drugId,
							spec: preDrug.drug.spec,
							retailUnit: preDrug.drug.retailUnit,
							dosageUnit: preDrug.drug.dosageUnit,
							retailPrice: preDrug.drug.retailPrice
						}
					}
					this.tableData.push(item)
				}
			}
		},
		//打开添加药品对话框
		getDrug() {
			GetDrugAll().then(res => {
				res.drug.forEach((item, index) => {
					let drugParam = {
						retailPrice: item.retailPrice,
						value: item.name,
						pinyin: item.pinyin,
						id: item.drugId,
						spec: item.spec,
						dosageUnit: item.dosageUnit,
						retailUnit: item.retailUnit
					}
					this.nameArr.push(drugParam)
				})
			})
		},
		addDrugTable() {
			let list = {
				id: '',
				drugName: '',
				total: '',
				frequency: '',
				singleDosage: '',
				days: '',
				usage: '',
				entrust: '',
				drug: {
					id: '',
					spec: '',
					retailUnit: '',
					dosageUnit: ''
				},
			}
			this.tableData.push(list)
			let refInput = 'drugInput' + (this.tableData.length - 1);
			setTimeout(() => {
				this.$refs[refInput].focus();
			}, 100)

			this.$refs.multipleTable.setCurrentRow(this.tableData[this.tableData.length - 1]);
		},
		delDrugTable() {
			this.$confirm('确认删除, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.tableData.splice(this.currentIndex, 1);
				this.drugInfoFlag = false;
			})
		},
		//添加处方明细
		addPrescriptionInfoTable() {
			if (!this.result || !this.entrust) {
				this.msgWarn('请填写嘱托或诊断');
				return;
			}
			let params = {
				doctorId: this.doctor.doctorId,
				patientId: this.currentRow.patient.patientId,
				illnessDescId: this.currentRow.illnessDesc.illnessDescId,
				result: this.result,
				entrust: this.entrust,
				auditStatus: 0,
				status: 0
			}
			AddPrescribe(params).then(res => {
				let arr = JSON.parse(JSON.stringify(this.tableData))
				for (let i = 0; i < arr.length; i++) {
					this.addPrescriptionInfo(arr[i], i, arr.length - 1, res.data)
				}
				this.sendPrescribe(res.data);
			});
		},
		sendPrescribe(preId) {
			let params = {
				orderId: this.currentRow.orderId.toString(),
				receiver: this.currentRow.patient.userId.toString(),
				message: preId.toString(),
				type: 'PRE',
				sender: this.userid
			}
			this.sendTextMsg(params).then(() => {
				AddMessage(params).then(res => {
					if (res.code === 200) {
						GetPreList({prescribeId: preId}).then(response => {
						  params.prescribe = response.data;
						  this.pushMessageList(params)
						})
						//this.$refs.chatRoom.getMessage();
						this.msgSuccess('处方发送成功');
						this.drugInfoFlag = false;
					}
				})
			})
		},
		getPrescribe(item) {
			GetPreList({prescribeId: item.message}).then(res => {
				this.$set(item, 'prescribe', res.data);
			})
		},
		// 添加处方明细
		addPrescriptionInfo(item, i, length, prescribeId) {
			console.log(item)
			let formInfos = {
				drugId: item.drug.id,
				prescribeId: prescribeId,
				drugUnit: item.total,
				frequency: item.frequency,
				medicationDays: item.days,
				medicationUsage: item.usage,
				singleUnit: item.singleDosage,
				unitPrice: item.drug.retailPrice,
				entrust: item.drug.entrust
			}
			for (let key in formInfos) {
				if(formInfos[key] === '') {
					this.$message.warning("请填选药品信息");
					return;
				}
			}
			AddPreDrug(formInfos).then(res => {
				console.log(res)
			})
		},
		handleCurrentChange(val) {
			if (val) {
				this.prescriptionInfo = val;
				this.currentDrug = val;
				if (val.id != '') {
					GetDrugId({id: val.drug.id}).then(res => {
						this.drugArr = res.drug[0]
						this.drugInfoFlag = true
					})
				} else {
					this.drugInfoFlag = false
				}
			}
		},
		finishIntegrity(flag) {
			EditInquiryOrder({orderId: this.currentRow.orderId, status: 2}).then(res => {
				this.$message.success("完诊成功")
				this.$refs.chatRoom.exitConference();
				this.currentRow = {};
				this.currentRow.orderId = -1;
				this.tableData = [];
				this.result = undefined;
				this.entrust = undefined;
				this.getOrderList(flag);
				this.changeStyle(false);
				this.drugInfoFlag = false;
			})
		},
		querySearchAsync(queryString, cb) {
			let restaurants = this.nameArr;
			let results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;
			clearTimeout(this.timeout);
			this.timeout = setTimeout(() => {
				cb(results);
			}, 0);
		},
		createStateFilter(queryString) {
			return (state) => {
				return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
					|| (state.pinyin.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
			};
		},
		cancelButtonClick() {
			if (this.inquiryTableData.length == 1) {
				this.cancelButton = ""
			}
		},
		onConfirm() {
			this.finishIntegrity(false);
		},
		onCancel() {
			this.finishIntegrity(true);
		},
		handleChange() {
			let tips = "是否确认开诊?";
			if (this.doctor.isOpen === 0) {
				tips = '是否确认关诊?';
			}
			if (this.total > 0 && this.doctor.isOpen === 0) {
				tips = '您当前候诊列表里还有排队的患者, 确认关诊吗?';
			}
			this.$confirm(tips, '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				let params = {
					doctorId: this.doctor.doctorId,
					isOpen: this.doctor.isOpen === 1 ? 0 : 1
				}
				EditDoctor(params).then(res => {
					this.msgSuccess(`您已成功${this.doctor.isOpen === 0 ? '关诊' : '开诊'}`);
					GetDoctorById(this.doctor.doctorId).then(response => {
						this.$store.commit('SET_DOCTOR', response.data)
					})
				}).catch(() => {
					this.msgError('操作失败');
				});
			})
		},
		handleSelect(item) {
			console.log(item)
			this.tableData[this.currentIndex].drug.dosageUnit =Number(this.dosUnit[0].dictValue)
			this.tableData[this.currentIndex].drug.retailUnit = item.retailUnit
			this.tableData[this.currentIndex].drug.spec = item.spec
			this.tableData[this.currentIndex].drug.id = item.id
			this.tableData[this.currentIndex].drug.retailPrice = item.retailPrice
			this.tableData[this.currentIndex].frequency = Number(this.frequencyOption[0].dictValue)
			this.tableData[this.currentIndex].usage = Number(this.usageOption[0].dictValue)
			this.tableData[this.currentIndex].days = Number(this.daysOption[0].dictValue)
			this.tableData[this.currentIndex].entrust = Number(this.entrustOption[0].dictValue)
			this.getDrugById(item.id);
		},
		getDrugById(id) {
			GetDrugId({id: id}).then(res => {
				this.drugArr = res.drug[0];
				this.drugInfoFlag = true;
			})
		},
		handleFocus(index) {
			this.currentIndex = index;
		},
		handleClose(done) {
			done();
		},
		rowClick(row, event, column) {
			this.currentIndex = row.index;
			this.getDrugById(row.drug.id);
		},
		tableRowClassName({row, rowIndex}) {
			row.index = rowIndex;
		},
		getSysDict() {
			this.getDicts("dosage_unit").then(response => {
				this.dosUnit = response.data;
			});
			this.getDicts('default_frequency').then(res => {
				this.frequencyOption = res.data
			})
			this.getDicts('drug_days').then(res => {
				this.daysOption = res.data
			})
			this.getDicts('default_usage').then(res => {
				this.usageOption = res.data
			})
			this.getDicts('doctor_entrust').then(res => {
				this.entrustOption = res.data
			})
			this.getDicts('retail_unit').then(res => {
				this.retailOption = res.data
			})
            this.getDicts("dosage").then(response => {
                this.dosageForm = response.data;
            });
		}
	}
}
</script>

<style lang="scss" scoped>
.patientInfos {
	display: flex;
	height: 30px;

	div {
		margin-right: 10px;
		display: flex;
		align-items: center;
		justify-content: center;

		img {
			width: 45px;
			height: auto;
		}

		p {
			font-size: 28upx;
			color: #434343;

			span {
				display: inline-block;
				padding: 0 5px 2px;
				border-bottom: 1px solid #434343;
				color: #4a90ff;
			}
		}
	}
}

.el-row {
	margin-bottom: 20px;

	&:last-child {
		margin-bottom: 0;
	}
}

.el-col {
	border-radius: 4px;
}

.bg-purple-dark {
	background: #99a9bf;
}

.bg-purple {
	margin-right: 20px;
}

.bg-purple-img {
	width: 100px;
	height: 80px;
	margin: 10px auto;
}

.bg-purple-img img {
	width: 100%;
	height: 100%;
}

.bg-purple-light {
	background: #e5e9f2;
}

.bg-purple-light p {
	font-size: 28upx;
}

.grid-content {
	border-radius: 4px;
	min-height: 36px;
}

.row-bg {
	padding: 10px 0;
	background-color: #f9fafc;
}

.bg-purple p {
	font-size: 28upx;
	color: #434343;
	margin: 8px 2px;

}

.bg-purple p span {
	display: inline-block;
	border-bottom: 1px solid #000;
	text-align: center;
	padding: 0 7px;
}

.colorF {
	color: #FF9900;
}

.colorC {
	color: #00CC00;
}

.infos {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
}

.infos p {
	width: 33.3%;
	color: #000000;
	font-weight: bolder;
}

.infos p span {
	color: #434343;
	font-weight: normal;
}

.starPatient {
	text-align: center;
	line-height: 40px;
	// padding-top: 60px;
	img {
		display: inline-block;
		margin: 0 auto;
		width: 160px;
		height: 160px;
	}

	p {
		font-size: 40upx;

		span {
			font-size: 22px;
			font-weight: bold;
			color: #3c7bca;
			margin: 0 5px;
		}
	}
}

.attackDays {
	width: 80px;
	height: 32px;
	line-height: 32px;
	border-radius: 4px;
	border: 1px solid #DCDFE6;
	box-sizing: border-box;
	color: #606266;
	margin: 0 10px;
	padding-left: 10px;
}

.attackItem {
	font-size: 28upx;
	color: #606266;
	font-weight: 700;
}

.videoRoom {
	z-index: 999;
	text-align: center;
	position: relative;

	img {
		// width:40px;
		position: absolute;
		top: 8px;
		right: 5px;
		z-index: 1000;
	}
}

.videoBig {
	width: 850px;
	height: 550px;
	background: #334154;
	position: fixed;
	right: 1px;
	bottom: 4px;
	z-index: 999;
	text-align: center;
}

.videoSmall {
	width: 150px;
	height: 30px;
	background: #99a9bf;
	position: fixed;
	right: 10px;
	bottom: 20px;
	z-index: 999;
	text-align: center;
}
</style>
<style>
.selInput .el-input-number--small {
	width: 200px
}

.bg-purple .el-card__body {
	padding: 20px 0 20px 0 !important;
}

.addDrug .el-input-number .el-input {
	width: 80px !important;
}

.no-data-class {
	font-size: 200px;
}

</style>
